<template>
    <div class="Home">
           <div id="starry">
                </div>
        <div class="banner">
              <img src="/static/image/banner压缩1.gif" alt="">
        </div>
        <div class="section borderBottom maringBottom">
            <ul class="listContent fn-clear line5">
                <li class="fn-left width1 borderRight">
                  <img src="./../../static/image/铭悦公告@2x.png" alt="">
                </li>
                <li class="fn-left width4">
                    <Notice></Notice>
                </li>
            </ul>
        </div>
          <div class="pop" v-if="isShow">
                <div class="check_num">
                   <div class="linkApp">
                      <ul  class="maskApp">
                          <li class="maskAppLi" v-on:click="openUrl('diditaxi://,com.sdu.didi.psnger')">
                            <div class="iconLink">
                                <div class="iconApp">
                                    <img src="./../../static/image/滴滴打车@2x.png" alt="">
                                </div>
                                <p class="line">
                                  滴滴打车
                                </p>
                            </div>
                            
                          </li>
                          <li class="maskAppLi" v-on:click="openUrl('cn.12306://,com.MobileTicket')">
                            <div class="iconLink">
                                <div class="iconApp">
                                  <img src="./../../static/image/12306@2x.png" alt="">
                                </div>
                                <p class="line">
                                  12306
                                </p>
                            </div>                          
                          </li>
                         <li class="maskAppLi" v-on:click="openUrl('https://h5.dingtalk.com/appcenter/detail.html?showmenu=false&dd_share=false&goodsCode=FW_GOODS-1000267840&corpId=dingcbcbb63d3edd5478')">
                            <div class="iconLink">
                                <div class="iconApp">
                                  <img src="./../../static/image/阿里商旅@2x.png" alt="">
                                </div>
                                <p class="line">
                                 阿里商旅
                                </p>
                            </div>                          
                          </li>
                         <li class="maskAppLi" v-on:click="openUrl('eleme://,me.ele')">
                            <div class="iconLink">
                                <div class="iconApp">
                                  <img src="./../../static/image/饿了么@2x.png" alt="">
                                </div>
                                <p class="line">
                                 饿了么
                                </p>
                            </div>                          
                          </li>
                      </ul>
                   </div>
                </div>
                <div class="mask" @click="cancel">
                </div>
            </div>
        <div class="section">
            <ul class="listContent listMargin iconstyleOne fn-clear line4">
                <li class="fn-left width1" v-on:click="openUrl('dingtalk://dingtalkclient/action/switchtab?index=2&name=work&scene=1&corpid=dingcbcbb63d3edd5478&appid=158')">
                    <div class="linkIcon"  >
                        <div class="icon">
                          <img src="./../../static/image/考勤打卡@2x.png" alt="">
                        </div>
                        <p class="name">考勤打卡</p>
                    </div>
                </li>
                <li class="fn-left width1" v-on:click="openUrl('https://aflow.dingtalk.com/dingtalk/mobile/homepage.htm?dd_web_timestamp=14%E2%80%A6rogress=false&dd_share=false&corpid=dingcbcbb63d3edd5478#/')">
                    <div class="linkIcon" >
                        <div class="icon">
                            <img src="./../../static/image/审批@2x.png">
                        </div>
                        <p class="name">审批</p>
                    </div>
                </li>
                <li class="fn-left width1" v-on:click="openUrl('https://landray.dingtalkapps.com/alid/app/report/home.html?dd_web_timestamp…&showmenu=false&dd_share=false&corpid=dingcbcbb63d3edd5478')">
                    <div class="linkIcon">
                        <div class="icon">
                            <img src="./../../static/image/日志@2x.png">
                        </div>
                        <p class="name">日志</p>
                    </div>
                </li>
                <li class="fn-left width1" v-on:click="openUrl('https://gztdd.hrwuu.com/home/DingTalk/dingRouter?dd_web_timestamp=150952627…lic%252Fnews%252Fjs%252Fpage%252Fmobile%252Findex.weex.js&dd_wx_ver=99.9.0')">
                    <div class="linkIcon">
                        <div class="icon">
                            <img src="./../../static/image/薪资查询@2x.png">
                        </div>
                        <p class="name">薪资查询</p>
                    </div>
                </li>
                <li class="fn-left width1"  @click="isApp()">
                    <div class="linkIcon">
                        <div class="icon">
                            <img src="./../../static/image/出行无忧@2x.png">
                        </div>
                        <p class="name">出行无忧</p>
                    </div>
                </li>
            </ul>
        </div>
        <div class="section">
            <ul class="listContent listMargin iconstyleOne fn-clear line3">
                <li class="fn-left width1" v-on:click="openUrl('http://guest.minyuecloud.com/?corpid=dingcbcbb63d3edd5478&dd_progress=false#/')">
                    <div class="linkIcon borderWith " >
                        <div class="icon">
                            <img src="./../../static/image/易捷云访客@2x.png">
                        </div>
                        <p class="name">易捷云访客</p>
                    </div>
                </li>
                <li class="fn-left width1" v-on:click="openUrl('https://gztdd.hrwuu.com/home/DingTalk/dingRouter?dd_web_timestamp=150952627…lic%252Fnews%252Fjs%252Fpage%252Fmobile%252Findex.weex.js&dd_wx_ver=99.9.0')">
                    <div class="linkIcon borderWith" >
                        <div class="icon">
                            <img src="./../../static/image/悦平台@2x.png">
                        </div>
                        <p class="name">悦平台</p>
                    </div>
                </li>
                <li class="fn-left width1" v-on:click="openUrl('https://h5.dingtalk.com/appcenter/detail.html?showmenu=false&dd_share=false&goodsCode=FW_GOODS-1000251548&corpId=dingcbcbb63d3edd5478')">
                    <div class="linkIcon borderWith xing" >
                        <div class="icon">
                            <img src="./../../static/image/星任务@2x.png">
                        </div>
                        <p class="name">星任务</p>
                    </div>
                </li>
            </ul>
        </div>
        <div class="section">
            <ul class="listContent listMargin iconstyleOne fn-clear line2">
                <li class="fn-left width1">
                    <div class="linkIcon">
                        <img >
                    </div>
                </li>
                <li class="fn-left width1">
                    <div class="linkIcon" >
                        <img >
                    </div>
                </li>
            </ul>
        </div>
        <!-- http://www.minyuecloud.com/ -->
        <div class="section">
            <ul class="listContent iconstyleOne  fn-clear line1">
                <li class="fn-left width1" >
                <a href="http://www.minyuecloud.com/">
                    <div class="guanwangLink" >
                        <img src="./../../static/image/官网链接@2x.png">
                    </div>
                    </a>
                </li>
            </ul>
        </div>
        <div class="section">
            <ul class="listContent listMargin iconstyleOne fn-clear line8">
                <li class="fn-left width1">
                    <div class="linkIcon" >
                        <img src="./../../static/image/员工职位@2x.png">
                    </div>
                </li>
                <!-- <li class="fn-left width1">
                    <div class="linkIcon" >
                        <img src="./../../static/image/企业文化@2x.png">
                    </div>
                </li> -->
                <!-- http://m.iread.wo.cn/dingtalk/index.action?corpId=dingcbcbb63d3edd5478&appId=2729 -->
                <li class="fn-left width1" v-on:click="openUrl('http://m.iread.wo.cn/dingtalk/index.action?corpId=dingcbcbb63d3edd5478&appId=2729')">
                    <div class="linkIcon" >
                        <img src="./../../static/image/员工学堂@2x.png">
                    </div>
                </li>
            </ul>
        </div>
    </div>
</template>
<script>
import "../assets/css/Home.css"
import Notice from "../components/Notice"
export default {
   components: { Notice, },
    data: function() {
        return {
            isShow:false,
            model: [],
          
        }
    },

    methods: {
          openUrl: function (url) {
            if(url.indexOf("http") > 1){
                ddapi.openLink(url)
            } else if (url.indexOf("dingtalk") > -1){

                location.href = url;
            } else {
                let app = url.split(",")
                this.$ddapi.App(app[0],app[1]);
            }
        },
        isApp: function () {
          this.isShow = true;
        },
        cancel:function(){
           this.isShow = false;
        },
         start: function() {
            //------星星------//
            function loadCricle() {

                var w = $(window).innerWidth() * 0.7;
                var h = $(window).innerHeight() * 0.5;
                $("#starry").css({ "width": w, "height": h });

                var num = 40; //生成点的个数
                var data = []; //定义一个数组，准备用来存坐标
                //生成num个点，并且存储初始坐标
                for (var i = 0; i < num; i++) {
                    data[i] = {
                        x: Math.random() * w,
                        y: Math.random() * h,
                        r: Math.random() * 18 + 3
                    };
                    Cricle(data[i].x, data[i].y, data[i].r);
                };
                //画点
                function Cricle(x, y, r) {
                    var m = parseInt(Math.random() * 10)
                    var div = $("<div />");
                    div.css({
                        "width": r + "px",
                        "height": r + "px",
                        "left": x + "px",
                        "top": y + "px",
                        "position": "absolute",
                        "animation": "flash 5s ease " + m + "s infinite normal both",
                    });
                    div.append("<img src='./../../static/image/star.png' style='width:100%;height:100%' />")
                    $("#starry").append(div);
                };

            }
     }
    
    },

    created: function() {

       this.start()
    },
    
}
</script>
